<template>
  <div class="login">
    <!-- 登录 -->
    <div class="text">手机号注册</div>
    <div class="numxx">
      <input type="text" placeholder="请输入手机号" />
      <input type="text" placeholder="请输入验证码" />
      <span>获取验证码</span>
    </div>
    <div class="butt">登录 / 注册</div>
    <div class="xieyi">
      登录/注册即代表同意<span>《中科慧学慧记服务协议》</span>
    </div>
  </div>
</template>
<script>
export default {
  data() {},
};
</script>
<style lang="scss" scoped="scoped">
.login {
  color: #333333;
  height: 100%;
  overflow: hidden;
  .text {
    font-size: 1.5rem;
    text-align: center;
    margin-top: 4.5rem;
  }
  .numxx {
    width: 20rem;
    height: 7rem;
    text-align: center;
    margin: 0 auto;
    margin-top: 4rem;
    position: relative;
    input {
      width: 18.75rem;
      border: none;
      outline: none;
      height: 2.75rem;
      background: #f7f9fa;
      border-radius: 1.375rem;
      margin-bottom: 1.25rem;
      padding-left: 1.25rem;
      font-size: 0.75rem;
    }

    span {
      display: inline-block;
      font-size: 0.75rem;
      position: absolute;
      right: 1.25rem;
      top: 5rem;
    }
  }
  .butt {
    width: 20rem;
    height: 2.75rem;
    background: #ffaf05;
    text-align: center;
    margin: 0 auto;
    line-height: 2.75rem;
    border-radius: 1.375rem;
    margin-top: 3.875rem;
  }
  .xieyi {
    text-align: center;
    font-size: 1rem;
    margin-top: 1.25rem;
    span {
      color: #06f;
    }
  }
}
</style>
